<template>
  <div style="background-color: #fff; min-height: calc(100vh)">
    <van-address-list
      v-model="chosenAddressId"
      :list="list"
      @select="onSelect"
      default-tag-text="默认"
      add-button-text="新增收货地址"
      @add="onAdd"
      @edit="onEdit"
    />
  </div>
</template>

<script>
import { getAddress } from '@/api/mine/personal'
export default {
  data() {
    return {
      chosenAddressId: null,
      dataList: [],
      list: []
    }
  },

  computed: {},

  mounted() {
    this.fetchList()
    this.chosenAddressId = this.$route.params.id - 0
  },

  methods: {
    // 获取首页数据
    fetchList() {
      this.list = []
      getAddress().then(res => {
        this.dataList = res.data
        this.dataList.forEach(b => {
          const sta = {
            id: b.id,
            name: b.name,
            tel: b.phone,
            address: b.province_name + b.city_name + b.town_name + b.addr,
            isDefault: b.is_default === 1
          }
          this.list.push(sta)
        })
      })
    },
    onSelect(item, index) {
      if (this.$route.query.source) {
        this.$router.push({
          name: 'IntegralDetails',
          query: { row: encodeURIComponent(JSON.stringify(this.dataList[index])) }
        })
      } else {
        this.$router.push({
          name: 'ConfirmOrder',
          query: { row: encodeURIComponent(JSON.stringify(this.dataList[index])) }
        })
      }
    },
    onEdit(item, index) {
      this.$router.push({
        path: '/edit-address',
        query: { row: encodeURIComponent(JSON.stringify(this.dataList[index])) }
      })
    },
    onAdd() {
      this.$router.push({ path: '/edit-address' })
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .van-address-list {
  .van-address-item {
    border-radius: 0;
    border-bottom: 0.02667rem solid #ebedf0;
  }
  .van-address-item .van-radio__icon--checked .van-icon {
    background-color: #009697;
    border-color: #009697;
  }
  .van-tag--danger {
    background: #fd953f;
    border-radius: 4px;
  }
  .van-address-list__bottom {
    bottom: 15px;
    padding: 0 50px;
    .van-button {
      height: 45px;
      background: #009697;
      border: 0.02667rem solid #009697;
    }
  }
}
</style>
